<div class="container-fluid">
    <!-- 顶级菜单-->
    <nav class="navbar navbar-light navbar-fixed-top navbar-full" style="border-bottom: 1px solid gainsboro">
        <a class="navbar-brand" href="/main">人工管理</a>
        <ul class="nav navbar-nav">
            <li *ngFor="let menu of topMenuVos" class="nav-item" [class.active]="menu.ID+'' === topActiveId">
                <a class="nav-link" href="javascript:void(0)" (click)="menuClick(menu)">{{menu.NAME}}</a>
            </li>
        </ul>

        <!-- 菜单右侧图标-->

        <ul class="nav navbar-nav pull-xs-right">
            <li class="nav-item">
                <a class="nav-link"><i class="icon-user icon-2x"></i></a>
            </li>
            <li class="nav-item" (click)="doLoginOut()">
                <a class="nav-link"><i class="icon-signout icon-2x"></i></a>
            </li>
        </ul>
    </nav>
    <div class="row mainBody">
        <!--左侧二级菜单 -->
        <div class="col-md-2" >
            <div class="row">
                <div class="nav navbar-light nav-stacked">
                    <!-- 左侧菜单-->
                    <ul class="nav navbar-nav col-md-10 offset-md-2" *ngFor="let lfMenu of leftMenuVos">
                        <li class="nav-item" [class.active]="lfMenu.ID === leftActiveId">
                            <a class="nav-link" href="javascript:void(0)"
                               (click)="leftMenuClick(lfMenu)">{{lfMenu.NAME}}</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- 右侧内容-->
        <div class="col-md-10" style="border-left: 1px solid gainsboro;">
            <ol class="breadcrumb container-fluid">
                <li class="breadcrumb-item active">{{tabName}}</li>
            </ol>
            <router-outlet></router-outlet>

        </div>
    </div>
</div>